let app = new Vue({
	el: '#app',
	data: {
		arr:[],
		list: [],
		arr2: [],
		curr: 1,
		size: 10,
		total: 20,
		ackAll:false,
		add_name: '',
		add_price: '',
		queryName: '',
		queryState: '',
		add_format: '',
		add_total: '',
		add_inventory: '',
		modify_id: '',
		modify_name: '',
		modify_price: '',
		modify_format: '',
		modify_total: '',
		modify_inventory: '',
	},
	created: function(){
		this.getList();
	},
	methods:{
		getList: function(){
			axios.get('http://chonghekj.com/crud/index.php/Home/Index/getItemList',{
				params: {
					pageSize: this.size,
					pageNumber: this.curr,
					item_name: this.queryName,
					item_state: this.queryState,
				}
			})
			.then((res)=>{
				console.log(res);
				this.list = res.data.rows;
				console.log(this.list);
				this.total = res.data.total;
			})
		},
		submit: function(){
			axios.post('http://chonghekj.com/crud/index.php/Home/Index/addItem',Qs.stringify({
					item_name: this.add_name,
					item_price: this.add_price,
					item_format: this.add_format,
					item_total: this.add_total,
					item_inventory: this.add_inventory,
			}))
			.then((res)=>{
				// console.log(res);
				this.getList();
				this.add_name = '';
				this.add_price = '';
				this.add_format = '';
				this.add_total = '';
				this.add_inventory = '';
				this.$refs.add.style.top = '-513px';
				this.$refs.cover.style.display = 'none'
			})
		},
		deleteItem: function(){
			if(this.arr.length == 0){
				alert('请选中删除项！')
			}else{
				axios.post('http://chonghekj.com/crud/index.php/Home/Index/deleteItem',Qs.stringify({
					ids: this.arr
				}))
				.then((res)=>{
					console.log(res);
					this.getList();
					this.arr = [];
				})
			}
		},
		submit2: function(){
			axios.post('http://chonghekj.com/crud/index.php/Home/Index/editItem',Qs.stringify({
				item_id: this.modify_id,
				item_name: this.modify_name,
				item_format: this.modify_format,
				item_total: this.modify_total,
				item_inventory: this.modify_inventory,
			}))
			.then((res)=>{
				console.log(res);
				this.$refs.modify.style.top = '-513px';
				this.$refs.cover.style.display = 'none';
				this.arr = [];
				this.arr2 = [];
				this.getList();
			})
		},
		modifyItem: function(){
			if(this.arr.length == 0){
				alert('请选中修改项！')
			}if(this.arr.length > 1){
				alert('请勿多选！')
			}if(this.arr.length == 1){
				this.$refs.modify.style.top = '50px';
				this.$refs.cover.style.display = 'block';
				for(let i=0; i<this.list.length; i++){
					if(this.arr[0] == this.list[i].item_id){
						this.arr2.push(this.list[i])
					}
				}
				this.modify_name = this.arr2[0].item_name;
				this.modify_id = this.arr2[0].item_id;
				this.modify_price = this.arr2[0].item_price;
				this.modify_format = this.arr2[0].item_format;
				this.modify_total = this.arr2[0].item_total;
				this.modify_inventory = this.arr2[0].item_inventory;
			}
		},
		queryItem: function(){
			this.getList();
			this.curr = 1;
			// console.log(this.curr)
		},
		cancelBtn2: function(){
			this.$refs.modify.style.top = '-513px';
			this.$refs.cover.style.display = 'none';
			this.arr = [];
			this.arr2 = [];
		},
		addItem: function(){
			this.$refs.add.style.top = '50px';
			this.$refs.cover.style.display = 'block'
		},
		cancelBtn: function(){
			this.$refs.add.style.top = '-513px';
			this.$refs.cover.style.display = 'none'
		},
		changeSize: function(){
			this.getList();
		},
		changeCurr: function(curr){
			this.curr = curr;
			this.getList();
		},
		changeAll: function(){
			if(this.ackAll){
				this.arr = this.list.map(function(val){
					return val.item_id
				})
			}else{
				this.arr = [];
			}
		},
		changeOne: function(){
			if(this.arr.length == this.list.length){
				this.ackAll = true
			}else{
				this.ackAll = false
			}
		}
	},
	computed:{
		pagenum: function(){
			return Math.ceil( this.total / this.size )
		}
	}
})